import { Toast } from "vant";
import { Image as VanImage } from "vant";
import { Dialog } from "vant";
import cTitle from "components/title";
import { scrollMixin } from "../../../utils/mixin";
export default {
  components: {
    cTitle,
    VanImage
  },
  mixins: [scrollMixin], //加载更多
  data() {
    return {
      verifierList: [],
      storeId: 0,
      isLoadMore: true,
      page: 1,
      totalPage: 0,
      keyword: ""
    };
  },
  activated() {
    if ((this.$route.query.storeId ?? "") !== "") {
      this.storeId = Number(this.$route.query.storeId);
    }
    this.page = 1;
    this.verifierLists();
  },
  methods: {
    onSearchChange(detail) {
      this.keyword = detail;
      // 防抖
      if (this.timer) clearTimeout(this.timer);
      this.timer = setTimeout(() => {
        this.debounce(this.verifierLists());
      }, 500);
    },
    onVerifierChange(item, index) {
      //提交核销员的启用状态给后端
      let json = {
        cstore_id: this.storeId,
        id: item.id,
        status: this.verifierList[index].checked ? 1 : 0
      };
      $http.post("plugin.coupon-store.frontend.clerk-manage.statusClerk", json, "正在获取").then(
        response => {
          if (response.result == 1) {
            Toast(response.msg);
          } else {
            this.$dialog.alert({ message: response.msg });
          }
        },
        function(response) {
          // console.log(response);
          // error callback
        }
      );
      // this.verifierList[index].checked = !this.verifierList[index].checked;
    },
    verifierUpdate(id) {
      this.$router.push(this.fun.getUrl("verifier", {}, { storeId: this.storeId, itemId: id }));
    },
    verifierDelete(id) {
      let json = {
        cstore_id: this.storeId,
        id: id
      };
      Dialog.confirm({
        title: "提示",
        message: "是否确认删除核销员"
      })
        .then(() => {
          $http.post("plugin.coupon-store.frontend.clerk-manage.deleteClerk", json, "正在获取").then(
            response => {
              if (response.result == 1) {
                Toast(response.msg);
                this.page = 1;
                setTimeout(() => {
                  this.verifierLists();
                }, 500);
              } else {
                this.$dialog.alert({ message: response.msg });
              }
            },
            function(response) {
              // console.log(response);
              // error callback
            }
          );
        })
        .catch(() => {});
    },
    onAddition() {
      this.$router.push(this.fun.getUrl("verifier", {}, { storeId: this.storeId }));
    },
    debounce(fn, delay) {
      let last, deferTimer;
      return function(args) {
        let that = this;
        let _args = arguments;
        let now = +new Date();
        if (last && now < last + delay) {
          clearTimeout(deferTimer);
          deferTimer = setTimeout(function() {
            last = now;
            fn.apply(that, _args);
          }, delay);
        } else {
          last = now;
          fn.apply(that, _args);
        }
      };
    },
    verifierLists() {
      let json = {
        cstore_id: this.storeId,
        page: this.page,
        kwd: this.keyword
      };
      $http.post("plugin.coupon-store.frontend.clerk-manage.clerkList", json, "正在获取").then(
        response => {
          if (response.result == 1) {
            let res = response.data;
            let list = res.data || [];
            this.isLoadMore = true;
            this.totalPage = res.last_page;
            list.forEach(item => {
              if (item.status) {
                item.checked = true;
              } else {
                item.checked = false;
              }
            });
            this.verifierList = list;
          } else {
            this.page = this.page - 1;
            this.isLoadMore = false;
            this.$dialog.alert({ message: response.msg });
          }
        },
        function(response) {
          // console.log(response);
          // error callback
        }
      );
    },
    getMoreData() {
      this.isLoadMore = false; // 防止多次请求分页数据
      if (this.page >= this.totalPage) {
        return;
      } else {
        this.page = this.page + 1;
        let json = {
          cstore_id: this.storeId,
          page: this.page,
          kwd: this.keyword
        };
        $http.post("plugin.coupon-store.frontend.clerk-manage.clerkList", json, "正在获取").then(
          response => {
            if (response.result == 1) {
              let res = response.data;
              let list = res.data || [];
              list.forEach(item => {
                if (item.status) {
                  item.checked = true;
                } else {
                  item.checked = false;
                }
              });
              this.isLoadMore = true;
              this.verifierList = [...this.verifierList, ...list];
            } else {
              this.page = this.page - 1;
              this.isLoadMore = false;
              this.$dialog.alert({ message: response.msg });
            }
          },
          function(response) {
            // console.log(response);
            // error callback
          }
        );
      }
    },
    handleScroll() {
      //滚动事件触发
      if (this.getScrollTop() + this.getClientHeight() + 105 > this.getScrollHeight()) {
        //此处发起请求
        if (this.isLoadMore) {
          this.getMoreData();
        } else {
          console.log("没有更多数据");
        }
      }
    }
  }
};
